<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>学生编辑</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport"
          content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <link rel="stylesheet" href="/static/layui/css/layui.css" media="all">
</head>
<body>

<div class="layui-form" lay-filter="layuiadmin-app-form-list" id="layuiadmin-app-form-list"
     style="padding: 20px 30px 0 0;">
    <div class="layui-row layui-form-item">
        <input type="text" name="id" class="form-control" hidden="hidden">
        <div class="layui-col-xs4">
            <label class="layui-form-label">姓名：</label>
            <div class="layui-input-block">
                <input type="text" name="name" lay-verify="required" autocomplete="off" class="layui-input"
                       placeholder="姓名">
            </div>
        </div>
        <div class="layui-col-xs4">
            <label class="layui-form-label">身份证号：</label>
            <div class="layui-input-block">
                <input type="text" name="idNo" lay-verify="required|identity" autocomplete="off" class="layui-input"
                       placeholder="身份证号">
            </div>
        </div>
        <div class="layui-col-xs4">
            <label class="layui-form-label">性别：</label>
            <div class="layui-input-block">
                <select id="gender" name="gender" lay-filter="gender" lay-verify="required">
                    <option value="1" selected>男</option>
                    <option value="0">女</option>
                </select>
            </div>
        </div>
    </div>
    <div class="layui-row layui-form-item">
        <div class="layui-col-xs4">
            <label class="layui-form-label">手机号：</label>
            <div class="layui-input-block">
                <input type="text" name="phone" lay-verify="required|phone" autocomplete="off" class="layui-input"
                       placeholder="电话">
            </div>
        </div>
        <div class="layui-col-xs4">
            <label class="layui-form-label">邮箱：</label>
            <div class="layui-input-block">
                <input type="text" name="email" lay-verify="required|email" autocomplete="off" class="layui-input"
                       placeholder="邮箱">
            </div>
        </div>
        <div class="layui-col-xs4">
            <label class="layui-form-label">籍贯：</label>
            <div class="layui-input-block">
                <select name="city" lay-verify="required">
                    <#if cityList?? && (cityList?size >0)>
                        <#list cityList as city>
                            <option value="${city.dictValue}">${city.dictName}</option>
                        </#list>
                    </#if>
                </select>
            </div>
        </div>
    </div>
    <div class="layui-row layui-form-item">
        <div class="layui-col-xs4">
            <label class="layui-form-label">职位：</label>
            <div class="layui-input-block">
                <input type="text" name="job" lay-verify="required" autocomplete="off" class="layui-input"
                       placeholder="职位">
            </div>
        </div>
        <div class="layui-col-xs4">
        <label class="layui-form-label">状态：</label>
        <div class="layui-input-block">
            <select id="state" name="state" lay-filter="state" lay-verify="required">
                <option value="0" selected>在读</option>
                <option value="1">休学</option>
                <option value="2">毕业</option>
                <option value="3">肄业</option>
            </select>
        </div>
        </div>
    </div>
    <div class="layui-row layui-form-item">
        <div class="layui-col-xs4">
            <label class="layui-form-label">所属院系：</label>
            <div class="layui-input-block">
                <select id="universitiesId" name="universitiesId"  lay-filter="universitiesId" lay-verify="required" lay-search="">
                    <option value="">请选择或搜索院系</option>
                    <#if universitiesList?? && (universitiesList?size >0)>
                        <#list universitiesList as universities>
                            <option value="${universities.id}">${universities.name}</option>
                        </#list>
                    </#if>
                </select>
            </div>
        </div>
        <div class="layui-col-xs4">
            <label class="layui-form-label">所属专业：</label>
            <div class="layui-input-block">
            <select id="majorId" name="majorId"  lay-filter="majorId" lay-verify="required" lay-search="">
                <option value="">请选择或搜索专业</option>
                <#if majorList?? && (majorList?size >0)>
                    <#list majorList as major>
                        <option value="${major.id}">${major.name}</option>
                    </#list>
                </#if>
            </select>
            </div>
        </div>
        <div class="layui-col-xs4">
            <label class="layui-form-label">所属班级：</label>
            <div class="layui-input-block">
            <select id="classId" name="classId"  lay-filter="classId" lay-verify="required" lay-search="">
                <option value="">请选择或搜索班级</option>
                <#if schoolClassList?? && (schoolClassList?size >0)>
                    <#list schoolClassList as schoolClass>
                        <option value="${schoolClass.id}">${schoolClass.name}</option>
                    </#list>
                </#if>
            </select>
            </div>
        </div>
    </div>
    <div class="layui-form-item layui-hide">
        <input type="button" lay-submit lay-filter="layuiadmin-app-form-submit" id="layuiadmin-app-form-submit"
               value="确认添加">
        <input type="button" lay-submit lay-filter="layuiadmin-app-form-edit" id="layuiadmin-app-form-edit"
               value="确认编辑">
    </div>
</div>
<script src="/static/layui/layui.js"></script>
<script>
    layui.config({
        base: '/static/' //静态资源所在路径
    }).extend({
        //主入口模块
        index: 'lib/index',
        treeSelect:'treeSelect/treeSelect',
    }).use(['index', 'form',"treeSelect"], function () {
        var $ = layui.$, form = layui.form, admin = layui.admin,treeSelect=layui.treeSelect;
        form.on('switch(status)', function (data) {
            var state = data.elem.checked ? 0 : 1;
            $(data.elem).attr('type', 'hidden').val(state);
        });

        //监听学院下拉框
        form.on('select(universitiesId)', function(dataObj){
            //移除专业下拉框所有选项
            $("#majorId").empty();
            var majorHtml = '<option value="">请选择或搜索专业</option>';
            $("#classId").html(majorHtml);
            var classHtml = '<option value="">请选择或搜索班级</option>';
            $("#classId").html(classHtml);
            provinceText = $("#universitiesId").find("option:selected").text();
            var value = $("#universitiesId").val();
            //异步加载下拉框数据
            $.get("/bs/major",{"universitiesId":value},function (data) {
                if(data.code!=0){
                    layer.msg(data.msg)
                }else{
                    var $html = "";
                    if(data.data != null) {
                        $.each(data.data, function (index, item) {
                            $html += "<option value='" + item.id + "'>" + item.name + "</option>";
                        });
                        $("#majorId").append($html);
                        //append后必须从新渲染
                        form.render('select');
                    }
                }

            });

        });

        //监听专业下拉框
        form.on('select(majorId)', function(dataObj){
            //移除班级下拉框所有选项
            $("#classId").empty();
            var classHtml = '';
            // var classHtml = '<option value="">请选择或搜索班级</option>';
            $("#classId").html(classHtml);

            cityText = $("#majorId").find("option:selected").text();
            var value = $("#majorId").val();
            //异步加载下拉框数据
            $.get("/bs/schoolClass",{"majorId":value},function (data) {
                if(data.code!=0){
                    layer.msg(data.msg)
                }else{
                    var $html = "";
                    if(data.data != null) {
                        $.each(data.data, function (index, item) {
                            $html += "<option value='" + item.id + "'>" + item.name + "</option>";
                        });
                        $("#classId").append($html);
                        //append后必须从新渲染
                        form.render('select');
                    }
                }

            });

        });
    });
</script>
</body>
</html>